/**
 * 基础菜单 商品管理
 */
<template>
  <div>
    <!-- 面包屑导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>受助单</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 搜索筛选 -->
    <el-form :inline="true"  class="user-search">
      <el-form-item label="搜索：">
        <el-input size="small" v-model="searchname" placeholder="输入受助单名称"></el-input>
      </el-form-item>
   
      <el-form-item>
        <el-button size="small" type="primary" icon="el-icon-search" @click="search">搜索</el-button>
        <el-button size="small" type="primary" icon="el-icon-plus" @click="add()">添加</el-button>
      </el-form-item>
    </el-form>
    <!--列表-->
    <el-table size="small" :data="listData" highlight-current-row v-loading="loading" border element-loading-text="拼命加载中" style="width: 100%;">
      <el-table-column align="center" type="selection" width="60">
        </el-table-column>
      <el-table-column sortable prop="id" label="ID" >
      </el-table-column>
      <el-table-column sortable prop="entryName" label="名称">
      </el-table-column>
      <el-table-column sortable prop="recipientId" label="受助人ID" >
      </el-table-column>
      <el-table-column sortable prop="introduction" label="受助详细" >
      </el-table-column>
      <el-table-column sortable prop="type" label="受助类型" >
      </el-table-column>
      <!-- <el-table-column sortable prop="pic" label="证明图片" width="300">
      </el-table-column> -->
       <el-table-column sortable prop="targetAmount" label="所需金额" >
      </el-table-column>
       <el-table-column sortable prop="account" label="账户" >
      </el-table-column>
      <el-table-column sortable prop="beginDate" label="创建时间" >
        <template slot-scope="scope">
          <div>{{scope.row.beginDate|timestampToTime}}</div>
        </template>
      </el-table-column>
      <el-table-column sortable prop="endDate" label="截止时间" >
        <template slot-scope="scope">
          <div>{{scope.row.endDate|timestampToTime}}</div>
        </template>
      </el-table-column>
       <el-table-column sortable prop="state" label="状态" >
      </el-table-column>
       <!-- <el-table-column sortable prop="reviewer" label="审核人" width="300">
      </el-table-column>
       <el-table-column sortable prop="stateM" label="发放状态" width="300">
      </el-table-column>
       <el-table-column sortable prop="reviewerM" label="发放审核人" width="300">
      </el-table-column> -->
      <!-- <el-table-column sortable prop="issuedAmount" label="已发放金额" width="300">
      </el-table-column> -->
      <!-- <el-table-column sortable prop="whereAbouts" label="流向说明" width="300">
      </el-table-column>
      <el-table-column sortable prop="picM" label="流向证明图" width="300">
      </el-table-column> -->
      <el-table-column align="center" label="操作" min-width="120">
        <template slot-scope="{ row }">
          <el-button size="mini" @click="edit(row)">编辑</el-button>
          <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页组件 -->
    <Pagination v-bind:child-msg="pageparm" @callFather="callFather"></Pagination>
    <!-- 编辑界面 -->

    <el-dialog :title="title" :visible.sync="editFormVisible" width="30%">


      <el-form label-width="120px" :model="newlist"  ref="newlist">
          <el-form-item label="项目名" prop="entryName">
          <el-input size="small" v-model="newlist.entryName" auto-complete="off" placeholder="请输入项目名"></el-input>
        </el-form-item>
        <!-- <el-form-item label="受助人ID" prop="recipientId">
          <el-input size="small" v-model="listData.id" auto-complete="off" placeholder="请输入受助人ID"></el-input>
        </el-form-item> -->
         <el-form-item label="受助信息" prop="introduction">
          <el-input size="small" v-model="newlist.introduction" auto-complete="off" placeholder="请输入受助信息"></el-input>
        </el-form-item>
        <el-form-item label="受助类型" prop="type">
           <el-radio v-model="newlist.type" label="孤寡老人">孤寡老人</el-radio>
           <el-radio v-model="newlist.type" label="贫困学生">贫困学生</el-radio>
           <el-radio v-model="newlist.type" label="烈士子女">烈士子女</el-radio>
           <el-radio v-model="newlist.type" label="其他">其他</el-radio>
        </el-form-item>
        <el-form-item label="所需金额" prop="targetAmount">
          <el-input size="small" v-model="newlist.targetAmount" placeholder="请输入所需金额"></el-input>
        </el-form-item>
         <!-- <el-form-item label="图片" prop="pic">
          <el-input size="small" v-model="newlist.pic" placeholder="请输入图片"></el-input>
        </el-form-item> -->
         <el-form-item label="账户" prop="account">
          <el-input size="small" v-model="newlist.account" placeholder="请输入账户"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" @click="closeDialog">取消</el-button>
        <el-button size="small" type="primary" :loading="loading" class="title"   @click="dialogStatus == 'create' ? createData() : ConfirmUpdateStudent()">保存</el-button>
      </div>



    </el-dialog>
  </div>
</template>

<script>
import axios from 'axios';
import Pagination from '../../components/Pagination'
export default {
  data() {
    return {
      myid:0,
      searchname:"",
      nshow: true, //switch开启
      fshow: false, //switch关闭
      loading: false, //是显示加载
      editFormVisible: false, //控制编辑页面显示与隐藏
      title: '添加',
      dialogStatus:"",
      newlist:{
        recipientId: ''
        },
      editForm: {
        id: '',
        entryName: '', 
        recipientId: '', 
        introduction: '', 
        type: '', 
        pic: '', 
        targetAmount: '',
        createDate: '', 
        account: '',
        days: '',
        state:'',
        reviewer:'',
        stateM: '',
        reviewerM:'',
        issuedAmount: '',
        whereAbouts: '',
        picM: '',
           },
      // rules表单验证
      rules: {
        deptName: [
          { required: true, message: '请输入部门名称', trigger: 'blur' }
        ],
        deptNo: [{ required: true, message: '请输入部门代码', trigger: 'blur' }]
      },
      formInline: {
        page: 1,
        limit: 10,
        varLable: '',
        varName: '',
        token: localStorage.getItem('logintoken')
      },
      // 删除部门
      seletedata: {
        ids: '',
        token: localStorage.getItem('logintoken')
      },
      userparm: [], //搜索权限
      listData: [], //用户数据
      // 分页参数
      pageparm: {
        currentPage: 1,
        pageSize: 10,
        total: 10
      }
    }
  },
  // 注册组件
  components: {
    Pagination
  },
  /**
   * 数据发生改变
   */

  /**
   * 创建完毕
   */
  created() {
    this.getdata()
    // this.newlist.recipientId = localStorage.getItem("id")
       this.myid   = localStorage.getItem("id")

  },

  /**
   * 里面的方法只有被调用才会执行
   */
  methods: {
  //   // 获取公司列表
    getdata() {
      this.loading = false
      axios.get("http://47.106.193.50:8080/user/entryByRecId?recipientId="+localStorage.getItem("id")).then(res => {
        
            let data = res.data.data
            this.listData = data
            // 分页赋值
            // this.pageparm.currentPage = this.formInline.page
            // this.pageparm.pageSize = this.formInline.limit
            // this.pageparm.total = res.count
        })
    },
    // 分页插件事件
    callFather(parm) {
      this.formInline.page = parm.currentPage
      this.formInline.limit = parm.pageSize
      this.getdata(this.formInline)
    },
    // 搜索事件
    search() {
        let arr= []
        let list =  this.listData
       console.log(list,'323232');
       if (this.searchname == "") {
           this.getdata()
       }else{
        // console.log(this.searchname);
        for (let i = 0; i < list.length; i++) {
         if (list[i].entryName.indexOf(this.searchname) >= 0) {
         arr.push(list[i])
      }}
        //  console.log(arr,'react');
         this.listData = arr
       }},
  

  
 
      // 添加
     add() {
    this.editFormVisible = true;
      this.dialogStatus = "create";
      console.log(this.dialogStatus,'添加');
      this.newlist = {}
    },
     // 控件
 createData() {
      console.log(this.dialogStatus,'添加');
      this.newlist.recipientId = this.myid;
  
     var data = this.newlist
     console.log(data,'add信息');
          axios.post("http://47.106.193.50:8080/user/addEntry",data).then((response) => {
            console.log(response);
            if (response.data.code == "200") {
              this.editFormVisible = false;
                         this.getdata()
              this.$notify({
                title: "添加成功",
                message: "edit Successfully",
                type: "success",
                duration: 2000,
                
              });
            } else {
              this.$notify({
               
                title: "添加失败",
                message: "edit failly",
                type: "warning",
                duration: 2000,
              });
               this.editFormVisible = false;
            }
            this.getdata()
          });
        
     
    },
    //修改更新
   async edit(row) {
      this.newlist = { ...row };
      this.editFormVisible = true;
      console.log(this.newlist, "edit 信息");
      this.title = "修改"
      this.dialogStatus = "edit";
      console.log(this.dialogStatus,'修改');

    },
    async ConfirmUpdateStudent() {
      console.log(this.dialogStatus,'修改');
    
      await axios.post("http://47.106.193.50:8080/user/updEntry",this.newlist).then((response) => {
        console.log(response);
        if (response.data.code == "200") {
          this.editFormVisible = false;
            this.getdata()

          this.$notify({
            title: "成功",
            message: "edit Successfully",
            type: "success",
            duration: 2000,
          });
        } else {
          this.$notify({
            title: "失败",
            message: "edit failly",
            type: "warning",
            duration: 2000,
          });
        }
      });
      this.getdata();
      this.editFormVisible = false;

      this.newlist = {};

    },

   
  
    // 删除

    handleDelete(row) {
      let data = row
    
      console.log(data);
      axios.post("http://47.106.193.50:8080/admin/delE",data).then((response) => {
        console.log(response);
        if (response.data.code == "200") {
      
          this.getdata()
          this.$notify({
            
            title: "删除成功",
            message: "delete Successfully",
            type: "success",
            duration: 2000,
          });
        } else {
          this.$notify({
            title: "删除失败",
            message: "delete failly",
            type: "warning",
            duration: 2000,
          });
        }
        this.getdata()
      });
    },
    // 关闭编辑、增加弹出框
    closeDialog() {
      this.editFormVisible = false
    }
  }
}
</script>

<style scoped>
.user-search {
  margin-top: 20px;
}
.userRole {
  width: 100%;
}
</style>

 
 